<!DOCTYPE HTML>
<html>
  <head>
  <title>Wave Notifier Options</title>
  <style type="text/css">
body {
    font-family: arial, sans-serif;
    background: #6BACCF url("options_bg.png") repeat-x top left;
    color: #fff;
}

body a, body a:visited {
    color: #fff;
    text-decoration: none;
    border-bottom: 1px dotted #fff;
}

body a:hover {
    border-bottom: 1px solid #fff;
}

#optionsBox {
    margin: 0 auto;
    margin-top: 50px;
    width: 500px;
}

#optionsBox input,select {
    margin-top: 5px;
}

#save {
    clear: both;
    float: right;
    margin: 0;
    padding: 0;
    text-align: right;
    font-size: 70%;
    font-weight: bold;
}
  </style> 
  <script type="text/javascript">
    // Saves options to localStorage.
    var cegbp = chrome.extension.getBackgroundPage();
    function save_options() {
      var wave_domains = document.forms[0].wave_domain1;
      var saved = true;
      for(var i in wave_domains) {
        if(wave_domains[i].checked) {
          if (wave_domains[i].value == "wave")
            localStorage["wave_domain"] = "https://wave.google.com/wave";
          else if (document.getElementById("g_apps").value.length > 0)  {             
            localStorage["wave_domain"] = "https://wave.google.com/a/" + document.getElementById("g_apps").value;
            localStorage["g_apps"] = document.getElementById("g_apps").value;
          }
          else {
            alert("Please enter your google app domain");
            saved = false;
          }

          break;
        }
      }
      if (saved) {   
        cegbp.refresh(); 
        alert("Your Settings Have Been Saved.");
      }
    }

    // Restores input states to saved values from localStorage.
    function restore_options() {       
      if(localStorage["wave_domain"] != null) {
        var wave_domains = document.forms[0].wave_domain1;
        var wave_domain = '';
        if ("https://wave.google.com/wave" == localStorage["wave_domain"])
          wave_domain = 'wave';
        else
          wave_domain = 'wave_g_apps';
        for(var i in wave_domains) {
          if (wave_domain == wave_domains[i].value) {
            wave_domains[i].checked = true;
            if (wave_domain == 'wave_g_apps')              
              document.getElementById("g_apps").value = localStorage["g_apps"] === undefined ? '' : localStorage["g_apps"];
            break;
          }
        }
      }
    }
  </script>
  </head>
  <body onload="restore_options()">
    <div id="optionsBox">
      <h1>Wave Notifier Options</h1>
      <p><a href="https://chrome.google.com/extensions/detail/ejnkjboklilbgoecmgapcbdkkiidcpkj" target="blank" title="Visit extension homepage">https://chrome.google.com/extensions/detail/ejnkjboklilbgoecmgapcbdkkiidcpkj</a></p>
      <form onsubmit="return false;">
        <div>
          <div style='width:120px;height:70px;float:left;'>
            <label for="wave_domain">Wave Domain: </label>
          </div>
          <div>
            <span><input type="radio" name="wave_domain1" value="wave" />http://wave.google.com/wave</span><br />
            <span><input type="radio" name="wave_domain1" value="wave_g_apps" />http://wave.google.com/a/<input id="g_apps" type="text" placeholder="wavesandbox.com" value=""/></span>
          </div>
          <div style='clear:left;'></div>     
        </div>
      </form>
      <div style='float:right;'>
        <button onclick="save_options()" style="text-align: center;width:70px;height:30px">Save</button>
        <button onclick="window.close();" style="text-align: center;width:70px;height:30px">Close</button>
      </div>
      <div style='clear:right;'></div>
    </div>
  </body>
</html>
